export default {
    data() {
        return {
            dialogViewHeight: 0,
            dialogTableHeight: 0,
            content: 0
        };
    },
    methods: {
        calDialogViewHeight() {
            this.$nextTick(() => {
                /**
                 * @params{string}  必须声明ref值ruleForm，所有的高度计算都是基于ref获取表单元素高度
                 *
                 * 返回值
                 *      1.dialogTableHeight 弹窗内表格的高度
                 *      2.dialogViewHeight 弹窗展示区的高度
                 * */
                // 表格高度 = appMain - 弹框距离顶部的高度 - 弹框头部高度(56)-弹框底部高度(63)- 特定的内外边距(20) - 表头高度
                const bodyMarginHeight = Math.ceil(window.innerHeight * 0.1);
                const dialogViewHeight = window.innerHeight - bodyMarginHeight - 139 - 10;
                this.dialogTableHeight = dialogViewHeight;

                // 减去其他的高度
                if (this.$refs.box1) {
                	if (Reflect.has(this.$refs.box1, 'offsetHeight')) {
		                this.dialogTableHeight -= (this.$refs.box1.offsetHeight) || 0;
	                } else if (Reflect.has(this.$refs.box1.$el, 'offsetHeight')) {
		                this.dialogTableHeight -= (this.$refs.box1.$el.offsetHeight) || 0;
	                }
                }
	            if (this.$refs.box2) {
		            if (Reflect.has(this.$refs.box2, 'offsetHeight')) {
		                this.dialogTableHeight -= (this.$refs.box2.offsetHeight) || 0;
	                } else if (Reflect.has(this.$refs.box2.$el, 'offsetHeight')) {
		                this.dialogTableHeight -= (this.$refs.box2.$el.offsetHeight) || 0;
	                }
                }
                if (this.$refs.box3) {
	                if (Reflect.has(this.$refs.box3, 'offsetHeight')) {
		                this.dialogTableHeight -= (this.$refs.box3.offsetHeight) || 0;
	                } else if (Reflect.has(this.$refs.box3.$el, 'offsetHeight')) {
		                this.dialogTableHeight -= (this.$refs.box3.$el.offsetHeight) || 0;
	                }
                }
	            if (this.$refs.box4) {
		            if (Reflect.has(this.$refs.box4, 'offsetHeight')) {
			            this.dialogTableHeight -= (this.$refs.box4.offsetHeight) || 0;
		            } else if (Reflect.has(this.$refs.box4.$el, 'offsetHeight')) {
			            this.dialogTableHeight -= (this.$refs.box4.$el.offsetHeight) || 0;
		            }
	            }
	            // 弹窗展示区的高度
                this.dialogViewHeight = dialogViewHeight;
            });
        }
    },
    mounted() {
        this.calDialogViewHeight();
        addEventListener('resize', () => {
            this.calDialogViewHeight();
        });
    },
    watch: {
        state(newVal) {
            if (newVal) {
                this.$nextTick(() => {
                    this.calDialogViewHeight();
                });
            }
        },
        dialogState(newVal) {
            if (newVal) {
                this.$nextTick(() => {
                    this.calDialogViewHeight();
                });
            }
        },
        saveDialogState(newVal) {
            if (newVal) {
                this.$nextTick(() => {
                    this.calDialogViewHeight();
                });
            } else {
                this.calDialogViewHeight();
            }
        }
    }
};
